<template>
	<view class="news">
		<view class="news_title">动态列表</view>
		
		<view class="news_list">
			 <!-- 循环arr数组 -->
			 <view class="list_item" v-for="item in arr">
				<navigator class="link" url="/pages/news_detail/news_detail">
					<view class="tit">{{item.title}}</view>
					<view class="date">{{item.date}}</view>
				</navigator>
			 </view>
		</view>
		
		<view class="msg" v-if="arr.length == 0">
			<text>没有动态列表~~</text>
		</view>
		
	</view>
</template>

<script setup>
//自定属性接收index.vue组件传递的数据
// defineProps(['arr'])
defineProps({
	arr: {
		type: Array
	}
})

</script>

<style lang="scss">
.news {
	padding: 20rpx 30rpx;
	.news_title {
		font-weight: bold;
	}
	.news_list {
		.link {
			display: block;
			margin-top: 10rpx;
			padding: 20rpx 0rpx;
			border-bottom: 1px dashed #ccc;
			.tit {
				margin-bottom: 10rpx;
			}
			.date {
				font-size: 28rpx;
				color: #666;
			}
		}
	}
	.msg {
		text-align: center;
		padding: 20rpx 0rpx;
		color: #666;
	}
}
</style>